import React, { Component } from 'react';
import '../styles/Sure_order.scss'
import { NavBar, List } from 'antd-mobile'
import * as service from "../api/index"


class Sure_order extends Component {
    constructor(props) {
        super(props);
        this.state = {
            shoplist: [],
            zongqian: 0,
            num: 0,
            moren: []

        };
    }
    async componentDidMount() {
        //订单列表
        var res = await service.order_confirmOrder({ userid: localStorage.getItem('userid'), time: this.props.history.location.state.time })
        this.setState({ shoplist: res.data.data, })
        // console.log(res.data.data);
        // console.log(this.props.history.location.state);

        //默认地址
        var res1 = await service.address_defaultAddress({ userid: localStorage.getItem('userid'), })
        // console.log(res1.data.data[0].addressDetail, res1.data.data[0].name);
        this.setState({ moren: res1.data.data[0] })
    }

    render() {
        return (
            <div className='sure_order'>
                <div className="top">
                    <div className="nav"><NavBar onBack={() => { this.props.history.go(-1) }} ><p>确定订单</p></NavBar></div>
                    <div className="address">
                        <List>
                            <List.Item onClick={() => { this.props.history.push('/address') }}>
                                {this.state.moren ?
                                    <div>
                                        <p>{this.state.moren.name}&emsp;&emsp;<span>{this.state.moren.tel}</span></p>
                                        <p>{this.state.moren.province}-{this.state.moren.city}-{this.state.moren.county}</p>
                                    </div>
                                    : '请添加地址'}
                            </List.Item>
                        </List>
                    </div>
                </div>

                <div className="shop">
                    {
                        this.state.shoplist.map((item) => {
                            return (
                                <div className="one" key={item.proid}>

                                    <div className="left">
                                        <img src={item.img1} alt="" />
                                    </div>
                                    <div className="right">
                                        <h5>{item.proname}</h5>
                                        <div className="xia">
                                            <div className="zuo">
                                                <span>￥{item.originprice}</span>
                                            </div>
                                            <div className="you">
                                                <span>X {item.num}</span>
                                            </div>
                                        </div>
                                    </div>

                                </div>
                            )
                        })

                    }
                    <div className="kuaidi">
                        <p>原价：{this.props.history.location.state.zongqian}</p>
                       
                    </div>
                </div>

                <div className="money">
                    <p>合计：<span>{this.props.history.location.state.zongqian}</span> <button onClick={() => { this.props.history.push('/view_orders') }}>去支付</button> </p>
                </div>
            </div>
        );
    }
}

export default Sure_order;

